<template>
	<view class="loader-inner line-scale-pulse-out-rapid">
		<view class="load-icon"></view>
		<view class="load-icon"></view>
		<view class="load-icon"></view>
		<view class="load-icon"></view>
		<view class="load-icon"></view>
	</view>
</template>

<script lang="ts">

export default {
	props: {
		type: {
			type: Number,
			default: 1
		}
	},
	data() {
		return {
		}
	},
	mounted(){  //创建vue实例之后,首次必执行的函数
	},
	methods: {
	}
}
</script>
<style scoped>
.line-scale-pulse-out-rapid > .load-icon:nth-child(1), .line-scale-pulse-out-rapid > .load-icon:nth-child(5) {
	-webkit-animation-delay: 0.5s !important;
	animation-delay: 0.5s !important;
}
.line-scale-pulse-out-rapid >  .load-icon {
	background-color: #ccc;
	width: 10rpx;
	height: 60rpx;
	border-radius: 2rpx;
	margin: 2rpx;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	display: inline-block;
	-webkit-animation: line-scale-pulse-out-rapid 0.9s 0s infinite cubic-bezier(.11, .49, .38, .78);
	animation: line-scale-pulse-out-rapid 0.9s 0s infinite cubic-bezier(.11, .49, .38, .78);
}

@-webkit-keyframes line-scale-pulse-out-rapid {
	0% {
			-webkit-transform: scaley(1);
			transform: scaley(1);
	}
	80% {
			-webkit-transform: scaley(0.3);
			transform: scaley(0.3);
	}
	90% {
			-webkit-transform: scaley(1);
			transform: scaley(1);
	}
}
</style>